<template>
  <div class="otherPage">
    <div class="layoutCon">
      <div class="loadBox" v-loading="loading">
       <el-tabs v-model="activeName">
          <el-tab-pane :label="user.title" name="user">
            <div v-html="user.content"></div>
          </el-tab-pane>
          <el-tab-pane :label="company.title" name="company">
            <div v-html="company.content"></div>
          </el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>
</template>

<script>
import { getPolicy, showTos } from "@/api";
export default {
  name: "",
  components: {},
  props: [],
  data() {
    return {
      user: {
        type:0,
        title: '',
        content: ''
      },
      company: {
        type:1,
        title: '',
        content: ''
      },
      activeName:'user',
      loading:true
    };
  },
  computed: {},
  created() {},
  mounted() {
    this.getPolicy(this.user);
    this.getPolicy(this.company);
  },
  methods: {
    async getPolicy(obj) {
      let res = await getPolicy({ type: obj.type });
      if (res.code == 200) {
        obj.title = res.data[0].foot_title;
        this.showTos(res.data[0].id,obj)
      }
    },
    async showTos(id, obj) {
      this.isShowDialog = true;
      let res = await showTos({ id: id });
      if (res.code == 200) {
        obj.content = res.data.content;
        this.loading=false;
      }else{
        this.loading=false;
      }
    }
  },
  watch: {}
};
</script>
<style lang="scss" scoped>
.loadBox{
  min-height: 300px;
}
</style>
